@primary: #39f;
@bg: #f2f6f9;
@white: #fefefe;
@border-base: #c2c2c2;
@font-primary: #2d2d2d; //主要文字
@font-regular: #616161; //常规文字
@font-secondary: #99999c; //次要文字
@font-placeholder: #c2c2c2; //占位文字
.header-bg() {
    background: linear-gradient(90deg,#1cabe9,#395aed);
} // 边框四角线
.out-frame(@scolor: #ff0000, @ecolor: #ff0000, @width: 2px, @length: 20px) {
    background: linear-gradient(to left, @scolor, @ecolor) left top no-repeat, linear-gradient(to bottom, @scolor, @ecolor) left top no-repeat, linear-gradient(to left, @scolor, @ecolor) right top no-repeat, linear-gradient(to bottom, @scolor, @ecolor) right top no-repeat, linear-gradient(to left, @scolor, @ecolor) left bottom no-repeat, linear-gradient(to bottom, @scolor, @ecolor) left bottom no-repeat, linear-gradient(to left, @scolor, @ecolor) right bottom no-repeat, linear-gradient(to left, @scolor, @ecolor) right bottom no-repeat;
    background-size: @width @length, @length @width, @width @length, @length @width;
}

.be-full(){
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

// 一像素上边框
.top-border-1px(@color) {
  position: relative;
  &:before {
    content: '';
    position: absolute;
    z-index: 200;
    left: 0;
    top: 0;
    width: 100%;
    height: 1px;
    background-color: @color;
  }
}

// 一像素上边框
.top-border-1px() {
    position: relative;
    &:before {
        content: '';
        position: absolute;
        z-index: 200;
        left: 0;
        top: 0;
        width: 100%;
        height: 1px;
        background-color: #e4e4e4;
    }
}

//清除浮动
.clearFix() {
    *zoom: 1;
    &:after {
        content: '';
        display: block;
        clear: both;
    }
}

/* 垂直居中 */

.mix-flex-y-center () {
    display: flex;
    align-items: center;
}

/* 水平居中 */

.mix-flex-x-center () {
    display: flex;
    justify-content: center;
}

/* 水平垂直居中 */

.mix-flex-center () {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 超出部分出省略号 */

.mix-text-overflow () {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/* 多行文本超出部分省略号 */

.ellipsis-line(@line: 2) {
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: @line;
    box-orient: vertical;
}